<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2022/11/2
  Time: 16:55
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" %>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="keywords" content="">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="${pageContext.request.contextPath}/assets/images/favicon.png" type="image/png">
    <title>Home</title>

    <link href="${pageContext.request.contextPath}/assets/css/bootstrap.min.css" rel="stylesheet">
    <!--Begin  Page Level  CSS -->
    <link href="${pageContext.request.contextPath}/assets/plugins/morris-chart/morris.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/assets/plugins/jquery-ui/jquery-ui.min.css" rel="stylesheet"/>
    <!--End  Page Level  CSS -->
    <link href="${pageContext.request.contextPath}/assets/css/icons.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/assets/css/bootstrap.min.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/assets/css/style.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/assets/css/responsive.css" rel="stylesheet">
    <script async="" src="https://www.googletagmanager.com/gtag/js?id=UA-144208445-2"></script>
    <style>
        th{
            text-align:center;
            height:60px;
            line-height:60px;
        }
        td{
            text-align:center;
            height:60px;
            line-height:60px;
        }
    </style>
</head>
<body class="sticky-header">
<jsp:include page="../inc/left.jsp"/>


<!-- main content start-->
<div class="main-content">

    <jsp:include page="../inc/header.jsp"/>

    <!--body wrapper start-->
    <div class="wrapper">

        <!--Start Page Title-->
        <div class="page-title-box">
            <ol class="breadcrumb">
                <li>
                    <a href="#">首页</a>
                </li>
                <li>
                    <a href="#">订单列表</a>
                </li>
                <li class="active">
                    订单详情
                </li>
            </ol>
            <h4 class="page-title">订单详情</h4>

            <div class="clearfix"></div>
        </div>
        <!--End Page Title-->


        <!--Start row-->
        <div class="row">

            <!-- Start Basic Table-->
            <div class="row-md-6">
                <div class="white-box">
                    <h2 class="header-title">基本信息</h2>
                    <div class="table-wrap">
                        <table class="table" id="t">
                            <thead>

                            <tr>
                                <th>订单编号</th>
                                <th>用户账号</th>
                                <th>订单创建时间</th>
                                <th>活动类型</th>
                            </tr>

                            </thead>

                            <tbody>
                            <tr>
                                <td>${order.orderSn}</td>
                                <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;${order.memberUsername}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                                <td><fmt:formatDate value="${order.createTime}" pattern="yyyy-MM-dd hh:mm:ss"/></td>
                                <td>${order.promotionInfo}</td>
                            </tr>
                            </tbody>

                        </table>
                    </div>
                </div>
            </div>
            <!-- End Basic Table-->
            <!-- Start  Striped  Table-->
            <div class="row-md-6">
                <div class="white-box">
                    <h2 class="header-title"> 商品信息</h2>
                    <div class="table-wrap">
                        <table class="table dataTable table-bordered">
                            <thead>
                            <tr>
                                <th>商品图片</th>
                                <th>商品名称</th>
                                <th>属性</th>
                                <th>数量</th>
                                <th>小计</th>

                            </tr>
                            </thead>
                            <tbody>
                            <c:forEach items="${order.orderItemList}" var="o">
                                <tr>
                                    <td><img src="${o.productPic}" width="50px"></td>
                                    <td>
                                            ${o.productName}<br>
                                        品牌：${o.productBrand}
                                    </td>
                                    <td>${o.productAttr}</td>
                                    <td>${o.productQuantity}</td>
                                    <td>${o.giftGrowth}</td>
                                </tr>
                            </c:forEach>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <!-- End  Striped Table-->

        </div> <!--/row-->

        <div class="row">
            <!-- Start  Bordered  Table-->
            <div class="row-md-6">
                <div class="white-box">
                    <h2 class="header-title"> 费用信息</h2>
                    <div class="table-wrap">
                        <table class="table dataTable table-bordered">
                            <thead>
                            <tr>
                                <th>商品合计</th>
                                <th>运费</th>
                                <th>优惠券</th>
                                <th>积分抵扣</th>
                                <th>活动优惠</th>
                                <th>折扣金额</th>
                                <th>订单总金额</th>
                                <th>应付款金额</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <th>${order.totalAmount}</th>
                                <th>${order.freightAmount}</th>
                                <th>-${order.discountAmount}</th>
                                <th>${order.integrationAmount}</th>
                                <th>${order.promotionAmount}</th>
                                <th>-${order.couponAmount}</th>
                                <th>${order.totalAmount+order.discountAmount+order.couponAmount}</th>
                                <th>${order.payAmount}</th>

                            </tr>

                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <!-- End  Bordered Table-->

            <!-- Start  hover  Table-->
            <div class="row-md-6">
                <div class="white-box">
                    <h2 class="header-title">收货人信息</h2>
                    <div class="table-wrap">
                        <table class="table dataTable table-bordered">
                            <thead>
                            <tr>
                                <th>收货人</th>
                                <th>手机号码</th>
                                <th>邮政编码</th>
                                <th>收货地址</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td>${order.receiverName}</td>
                                <td>${order.receiverPhone}</td>
                                <td>${order.receiverPostCode}</td>
                                <td>${order.receiverCity}&nbsp;
                                    ${order.receiverRegion}&nbsp;
                                    ${order.receiverDetailAddress}
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <!-- End  hover Table-->

        </div> <!--/row-->

        <div class="row">
            <!-- Start  hover  Table-->
            <div class="row-md-6">
                <div class="white-box">
                    <h2 class="header-title"> 操作信息</h2>
                    <div class="table-wrap">
                        <table class="table dataTable table-bordered">
                            <thead>
                            <tr>
                                <th>操作者</th>
                                <th>操作时间</th>
<%--                                <th>订单状态</th>--%>
<%--                                <th>付款状态</th>--%>
<%--                                <th>发货状态</th>--%>
                                <th>备注</th>
                            </tr>
                            </thead>
                            <tbody>
                            <c:forEach items="${order.orderOperateHistoryList}" var="o">
                            <tr>
                                <th>${o.operateMan}</th>
                                <th><fmt:formatDate value="${o.createTime}" pattern="yyyy-MM-dd hh:mm:ss"/></th>
<%--                                <th>${o.orderStatus}</th>--%>
                                <th>${o.note}</th>
                            </tr>
                            </c:forEach>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <!-- End  hover Table-->

            <!-- Start  hover  Table-->
            <!-- End  hover Table-->

        </div>
        <!--/row-->

    </div>
    <!-- End Wrapper-->


    <!--Start  Footer -->

    <!--End footer -->

</div>
<!--End main content -->


<!--Begin core plugin -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/plugins/moment/moment.js"></script>
<script src="assets/js/jquery.slimscroll.js "></script>
<script src="assets/js/jquery.nicescroll.js"></script>
<script src="assets/js/functions.js"></script>
<!-- End core plugin -->

</body>
</html>
